@extends('layouts.scaffold')

@section('head')
	{{ HTML::style('styles/gameTeams.css') }}

	<script type="text/javascript">
		var TeamsController = function($scope, $http, $location, $window)
		{
			$scope.game = {{$game}};
			console.log($scope.game);
			$scope.teams = {{$teams}};
			console.log($scope.teams);

			$scope.showError;

			//-----------------------------------ng-click criar jogo------------
			$scope.submitTeams = function()
			{
				var teams = [];
				for (var i = 0; i < $scope.game.numEquipas ; i++)
				{
					teams.push($scope.teams[i].nome);
					console.log(teams[i]);
				};
				
				$http({
				            url: location.origin + location.pathname + "/editar",
				            method: "POST",
				            data: 	{
				            			"game"	:  	$scope.game,
				            			"teams"	: 	teams, 
				            		}
				        }).success	(function(data, status, headers, config) {
				        	console.log("Received data");
				        	console.log(data);
				        	if(data["result"] == "ok")
				        	{
				        		var url = $location.url(location.origin + '/mapa');
				        		$window.location = url.$$protocol + '://' + url.$$host + '/jogo-mina/public/mapa'; 				        	
				        	}
				        	else
				        	{
				        		$scope.showError = true;  
				        	}
				    	}).error	(function(data, status, headers, config) {
				    		console.log("Request failed");
				    		console.log(data);
				    		$scope.showError = true;
				    	});

			}
		}
	</script>
@endsection

@section('navbar')
	@include('menu.navbar')
@endsection

@section('main')
<div ng-controller="TeamsController" class="panel panel-primary">
	<div class="panel-primary">
		<h2 class="panel-heading">Definir Equipas</h2>
	</div>
	<div class="panel-body">
		<!-- Alert: Error alert -->
		<div ng-if="showError" ng-init="false" class="panel alert alert-danger" role="alert">Ocorreu um erro. Tente mais tarde...</div>
		
		<!-- Form: Game info -->
		<div class="panel">
			<form role="form" class="form-horizontal" ng-valid ng-submit="submit()">
				<fieldset disabled>
					<div id="dadosJogo"><h4><strong>Dados do Jogo: </strong></h4></div>
					<!-- Nome do Jogo -->
					<div class="form-group">
						<label for="gameName" class="col-sm-1 control-label">Nome</label>
						<div class="col-sm-4"><input type="text" class="form-control" id="gameName" ng-model="game.nome"></div>

					<!-- Tamanho do Jogo -->
						<label for="gameSize" class="col-sm-1 control-label">Equipas</label>
						<div class="col-sm-4"><input type="text" class="form-control" id="gameSize" ng-model="game.numEquipas"></div>
					</div>

					<!-- Empresa do Jogo -->
					<div class="form-group">
						<label for="gameCompany" class="col-sm-1 control-label">Empresa</label>
						<div class="col-sm-4"><input type="text" class="form-control" id="gameCompany" ng-model="game.empresa"></div>
					
					<!-- Data do Jogo -->
						<label for="gameDate" class="col-sm-1 control-label">Data</label>
						<div class="col-sm-4"><input type="date" class="form-control" id="gameDate" ng-model="game.data"></div>
					</div>
				</fieldset>
			</form>
		</div>

		<!-- Form: Game team composition -->
		<div>
			<div class="col-md-1"><h4><strong>Equipas: </strong></h4></div>
			<form role="form" name="teamsForm" class="form-horizontal col-md-10" ng-valid ng-submit="submitTeams()">
			  <div ng-repeat="team in teams" class="form-group">
			    <label class="col-sm-2 control-label" for="teamName">Equipa nº [[$index + 1]]</label>
			    <div class="col-sm-10">
			    	<input type="text" class="form-control" name="teamName" ng-model="team.nome" placeholder="Insira o nome da equipa">
			    </div>
			  </div>
			  <div class="col-sm-2" id="btnCriar">
			  	<button type="submit" class="btn btn-primary btn-block">Guardar</button>
			  </div>
			</form>
		</div>
	</div>
</div>
@endsection